<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="医院名称" prop="institutionName">
        <el-input
          v-model="queryParams.institutionName"
          placeholder="请输入医院名称"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <el-table v-loading="loading" :data="nationList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column
        label="序号"
        type="index"
        width="50">
      </el-table-column>
      <el-table-column label="医院名称" align="center" prop="name" />
      <el-table-column label="辖区" align="center" prop="areaname" />
      <el-table-column label="诊疗科目数" align="center" prop="medicalSpecialtiesValue" />
      <el-table-column label="监控数" align="center" prop="monitorValue" />
      <el-table-column label="白名单开关" align="center" prop="enabled" >
        <template slot-scope="scope">
          <el-tag v-if="scope.row.enabled == '0'">关</el-tag>
          <el-tag v-else >开</el-tag>
        </template>

      </el-table-column>>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
       <!-- <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
            v-hasPermi="['system:nation:edit']"
          >修改辖区</el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['system:nation:remove']"
          >查看</el-button>
        </template> -->
		<!-- <template slot-scope="scope">
		  <el-button
		    size="mini"
		    type="text"
		    icon="el-icon-edit"
		    @click="handleUpdate(scope.row)"
		    v-hasPermi="['system:nation:edit']"
		  >修改辖区</el-button>
		  <el-button
		    size="mini"
		    type="text"
		    icon="el-icon-delete"
		    @click="handleDelete(scope.row)"
		    v-hasPermi="['system:nation:remove']"
		  >查看</el-button>
		</template> -->
		<template slot-scope="scope">
		  <el-button
		    size="mini"
		    type="text"
		    icon="el-icon-edit"
		  >修改辖区</el-button>
		  <el-button
		    size="mini"
		    type="text"
        @click="handleUpdate(scope.row)"
		  >查看</el-button>
		</template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- 添加或修改国家机构对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="100px">

        <el-form-item label="医院名称" prop="institutionName">
          <el-input v-model="form.institutionName" placeholder="请输入机构名称" />
        </el-form-item>
        <el-form-item label="医院简介" prop="secondName">
          <el-input v-model="form.secondName" placeholder="请输入第二名称" />
        </el-form-item>
        <el-form-item label="统一社会信用代码" prop="region">
          <el-input v-model="form.medicalUscc" placeholder="请输入辖区" />
        </el-form-item>
        <el-form-item label="所有制形式" prop="check">
          <el-input v-model="form.medicalOwnership" placeholder="请输入是否校验" />
        </el-form-item>

        <el-form-item label="是否有放射所有权" prop="medicalLicense">
          <el-input v-model="form.medicalLicense" placeholder="请输入医疗机构执业许可证" />
        </el-form-item>

        <el-form-item label="登记号" prop="minkeMedicalId">
          <el-input v-model="form.registerNumber" placeholder="请输入机构唯一编码" />
        </el-form-item>
        <el-form-item label="机构属性" prop="temp">
          <el-input v-model="form.medicalCategory" placeholder="请输入临时状态" />
        </el-form-item>
        <el-form-item label="放射诊疗许可证" prop="medicalLevel">
          <el-input v-model="form.medicalLevel" placeholder="请输入机构级别" />
        </el-form-item>
        <el-form-item label="全国唯一识别码" prop="medicalCategory">
          <el-input v-model="form.medicalCategory" placeholder="请输入机构类别" />
        </el-form-item>
        <el-form-item label="诊疗科目" prop="medicalRankname">
          <el-input v-model="form.medicalSpecialtiesName" placeholder="请输入机构等次" />
        </el-form-item>
        <el-form-item label="国家级限制技术" prop="medicalNaturebusiness">
          <el-input v-model="form.medicalNaturebusiness" placeholder="请输入经营性质" />
        </el-form-item>
        <el-form-item label="省级限制技术" prop="medicalRelationship">
          <el-input v-model="form.medicalRelationship" placeholder="请输入隶属关系" />
        </el-form-item>
        <el-form-item label="医生列表" prop="medicalOwnership">
          <el-table v-loading="loading" :data="dockorList" @selection-change="handleSelectionChange">
            <el-table-column type="selection" width="55" align="center" />
            <el-table-column
              label="序号"
              type="index"
              width="50">
            </el-table-column>
            <el-table-column label="医生姓名" align="center" prop="name" />
            <el-table-column label="医师类别" align="center" prop="parcticeclass" />
            <el-table-column label="任职资格" align="center" prop="workcpet" />
            <el-table-column label="执业范围" align="center" prop="parcticescope" />
            <el-table-column label="主要执业机构" align="center" prop="unit" />
            <!--  <el-table-column label="辖区" align="center" prop="regionName" />
              <el-table-column label="处方权" align="center" prop="hemp" /> -->
            <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
              <template slot-scope="scope">
                <!--<el-button
                  size="mini"
                  type="text"
                  icon="el-icon-edit"
                  @click="handleUpdate(scope.row)"
                >查看</el-button>-->
                <!-- <el-button
                   size="mini"
                   type="text"
                   icon="el-icon-delete"
                   @click="handleDelete(scope.row)"
                 >删除</el-button>-->
              </template>
              <!--<el-button
                size="mini"
                type="text"

              >查看</el-button>-->
            </el-table-column>
          </el-table>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { listNation, getNation, delNation, addNation, updateNation, exportNation } from "@/api/system/nation";
import { listDockor} from "@/api/his/dockor";
export default {
  name: "Nation",
  data() {
    return {
      dockorList: [],
      // 遮罩层
      loading: true,
      // 导出遮罩层
      exportLoading: false,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 国家机构表格数据
      nationList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        registerNumber: null,
        institutionName: null
      },
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        registerNumber: [
          { required: true, message: "登记号不能为空", trigger: "blur" }
        ],
        institutionName: [
          { required: true, message: "机构名称不能为空", trigger: "blur" }
        ],
      }
    };
  },
  created() {
    this.getList();
  },
  methods: {
    /** 查询国家机构列表 */
    getList() {
      this.loading = true;
      listNation(this.queryParams).then(response => {
        this.nationList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        uniqueCode: null
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.uniqueCode)
      this.single = selection.length!==1
      this.multiple = !selection.length
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "添加国家机构";
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      const registerNumber = row.number
      console.log(registerNumber)
      getNation(registerNumber).then(response => {
        this.form = response.data;
        this.open = true;
        this.title = "修改国家机构";
        this.getDockorList(response.data.registerNumber)
      });
    },
    getDockorList(registerNumber) {
      this.loading = true;
      this.queryParams.registerNumber = registerNumber
      listDockor(this.queryParams).then(response => {
        this.dockorList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.form.uniqueCode != null) {
            updateNation(this.form).then(response => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addNation(this.form).then(response => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const uniqueCodes = row.uniqueCode || this.ids;
      this.$modal.confirm('是否确认删除国家机构编号为"' + uniqueCodes + '"的数据项？').then(function() {
        return delNation(uniqueCodes);
      }).then(() => {
        this.getList();
        this.$modal.msgSuccess("删除成功");
      }).catch(() => {});
    },
    /** 导出按钮操作 */
    handleExport() {
      const queryParams = this.queryParams;
      this.$modal.confirm('是否确认导出所有国家机构数据项？').then(() => {
        this.exportLoading = true;
        return exportNation(queryParams);
      }).then(response => {
        this.$download.name(response.msg);
        this.exportLoading = false;
      }).catch(() => {});
    }
  }
};
</script>
